{% extends "base.html" %}

{% block content %}
<script type="text/javascript" src="/static/js/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="/static/js/jquery-ui-1.8.16.custom.min.js"></script>
<link href="/static/css/jquery-ui-1.8.16.custom.css" rel="stylesheet" type="text/css" />
<style type="text/css">@import url(/static/css/jquery-calendar.css);</style>
<script language="javascript" type="text/javascript">
$(document).ready(
	function()
	{
  
		var dc={{datecount}};
		if (dc>=4)
		{
	    $('#class_date3').datepicker({"dateFormat": "dd/mm/yy",changeMonth:true,changeYear:true})
	    $('#class_date4').datepicker({"dateFormat": "dd/mm/yy",changeMonth:true,changeYear:true})
		}
		if (dc==5)
		{
	    $('#class_date5').datepicker({"dateFormat": "dd/mm/yy",changeMonth:true,changeYear:true})
		}
		$('#class_start').datepicker({"dateFormat": "dd/mm/yy",changeMonth:true,changeYear:true})
		$('#class_end').datepicker({"dateFormat": "dd/mm/yy",changeMonth:true,changeYear:true})
	}
);
 function setvalue()
 {
	var a=document.getElementById('v_forv').value; 
	document.getElementById('venue').value=a; 
 }
 </script>
<style type="text/css">
<!--
body,td,th {
	font-size: 12px;
}
.saminput{
width:60px;
}
-->
</style>
 <style>
 .list-div {
  width: 96%;
  border: 1px solid #BBDDE5;
}
.list-div table {
  border: 1px solid #BBDDE5;
}
.list-div th {
  line-height: 24px;
  background: #BBDDE5 url("/static/images/th_bg.gif") repeat-x;
  white-space: nowrap;
}

.list-div td {
  line-height: 22px;
}
tr.over td {background:#F4FAFB; 
} 
</style>
<script language=javascript>
function verify(form){
 if(form.class_start.value==''){
	alert("Start time can't be empty!")
	form.class_start.focus();
	return false;
 }
 return true;
}
</script>
</head>

<body>

    <!-- tab bar -->

      <p>
		{%for p in p_list%}
		<span class="tab-back" id="mix-tab"><a href="/p_information/?pid={{p.id}}">{%if p_obj.id == p.id %}<font color='red'><b>{{p.name}}</b></font>{%else%}{{p.name}}{%endif%}</a></span>
		{%endfor%}
      </p>


<form name="saveinfo" method="post" onsubmit="return verify(this);">
<input type='hidden' name='program_id' value='{{p_obj.id}}'/>
<table width="100%" border="1" cellpadding="1" cellspacing="1" bordercolor="#64D5F0" bgcolor="#D1FAFE">
  <tr style="background:#0099ff;color:#ffffff;">
    <td WIDTH="120">Reference#</td>
    <td WIDTH="120">Modules</td>
	{%if isnotsdf%}
    <td WIDTH="80">Core/Elective</td>
    <td WIDTH="80">Course Code</td>
    <td WIDTH="80">Season</td>
	{%endif%}
    <td WIDTH="60">Year</td>
    <td WIDTH="120">Class Date</td>
    <td WIDTH="100">Lecturer</td>
    <td WIDTH="100">Textbook</td>
    <td WIDTH="80">Venue</td>
    <td WIDTH="60">Attach Course Materials</td>
  </tr>
  <tr>
    <td><input type="text" name="period" id="period" value="" /></td>
    <td>
	<textarea name="modules" id="modules" cols="10" rows="6"></textarea>
	</td>
		{%if isnotsdf%}
    <td>
	<select name="core_elective" id="core_elective">
	<option value="">Select</option>
	<option value="Core">Core</option>
	<option value="Elective">Elective</option>
	</select>
	</td>
    <td><input type="text" name="coursecode" id="coursecode" value="" class="saminput" /></td>
    <td>
	<select name="season" id="season">
	<option value="">Select</option>
	<option value="Spring">Spring</option>
	<option value="Summer">Summer</option>
	<option value="Fall">Fall</option>
	</select>
	</td>
	{%else%}
	<input type="hidden" name="core_elective" id="core_elective" value="" />
	<input type="hidden" name="coursecode" id="coursecode" value="" />
	<input type="hidden" name="season" id="season" value="" />
	{%endif%}
    <td>
	<select name="year" id="year">
	<option value="2010">2010</option>
	<option value="2011">2011</option>
	<option value="2012">2012</option>
	<option value="2013">2013</option>
	<option value="2014">2014</option>
	<option value="2015">2015</option>
	</select>
	</td>
    <td>Day 1: <input type="text" name="class_start" id="class_start" value="" class="saminput" />
	<br>
	Day 2: <input type="text" name="class_end" id="class_end" value="" class="saminput" />
	{%if datecount >= 4%}
	<br>Day 3: <input type="text" name="class_date3" id="class_date3" value="" class="saminput" />
	<br>Day 4: <input type="text" name="class_date4" id="class_date4" value="" class="saminput" />
	{%endif%}
	{%if datecount == 5%}
	<br>Day 5: <input type="text" name="class_date5" id="class_date5" value="" class="saminput" />
	{%endif%}
	</td>
    <td><input type="text" name="lecture" id="lecture" value="" /></td>
    <td>
<textarea name="textbook" id="textbook" cols="20" rows="8"></textarea>
	</td>
    <td>
	<select name="v_forv" id="v_forv" onchange="javascript:setvalue();" style="width:100px;">
	<option value="">Select</option>
	<option value="Regus (Wan Chai)">Regus (Wan Chai)</option>
	<option value="Cliftons (Central)">Cliftons (Central)</option>
	<option value="One Island East (Tai Koo)">One Island East (Tai Koo)</option>
	<option value="Infinitus Plaza (Sheung Wan)">Infinitus Plaza (Sheung Wan)</option>
	<option value="">Others</option>
	</select><br>
	<input type="text" name="venue" id="venue" value="" style="width:95px;" />
	</td>
    <td><input type="text" name="attoch" id="attoch" value="" style="width:50px;" /></td>
  </tr>  
  <tr>
    <td colspan="12"><input type="submit" name="gosave" value=" Save " /></td>
  </tr>
</table>
</form>
<table width="100%" border="1" cellpadding="1" cellspacing="1" bordercolor="#64D5F0" bgcolor="#D1FAFE" class="aui-ibox-data aui-dotted-split">
  <tr>
    <td colspan="14" style="line-height:26px">Timetable of <font color='red'><b>{{p_obj.name}}</b></font></td>
  </tr>
  <tr style="background:#0099ff;">
    <td WIDTH="80">Reference#</td>
    <td WIDTH="80">Modules</td>
    {%if isnotsdf == '1'%}<td WIDTH="80">{%if p_obj.id == 4%}C/E{%else%} {%if p_obj.id == 16%}C/E{%else%}Core/Elective{%endif%}{%endif%}</td>
    <td WIDTH="70">Course Code</td>
    <td WIDTH="60">Season</td>
	{%endif%}
    <td WIDTH="50">Year</td>
    <td WIDTH="120">Class Date</td>
    <td WIDTH="80">Lecturer</td>
    <td >Textbook</td>
    <td WIDTH="60">Venue</td>
    <td WIDTH="60">Attach Course Materials</td>
    <td>Options</td>
  </tr>
  {%for pc in pc_list%}
  <tr style="line-height:22px;">
    <td WIDTH="80">{{pc.p.period}}&nbsp;</td>
    <td WIDTH="80">{{pc.p.modules}}&nbsp;</td>
    {%if isnotsdf == '1'%}<td WIDTH="80">{{pc.p.core_elective}}&nbsp;</td>
    <td WIDTH="70">{{pc.p.coursecode}}&nbsp;</td>
    <td WIDTH="60">{{pc.p.season}}&nbsp;</td>
	{%endif%}
    <td WIDTH="50">{{pc.p.year}}&nbsp;</td>
    <td WIDTH="120">
		{%if pc.p.class_start%}Day 1:&nbsp;{{pc.p.class_start|date:'M d,Y'}}<br>{%endif%}
		{%if pc.p.class_end%}Day 2:&nbsp;{{pc.p.class_end|date:'M d,Y'}}<br>{%endif%}
		{%if pc.p.class_date3%}{%if datecount >= 4%}Day 3:&nbsp;{{pc.p.class_date3|date:'M d,Y'}}<br>{%endif%}
		{%if pc.p.class_date4%}Day 4:&nbsp;{{pc.p.class_date4|date:'M d,Y'}}{%endif%}<br>{%endif%}
		{%if pc.p.class_date5%}{%if datecount == 5%}Day 5:&nbsp;{{pc.p.class_date5|date:'M d,Y'}}{%endif%}{%endif%}
	</td>
    <td WIDTH="80">{{pc.p.lecture}}&nbsp;</td>
    <td >{{pc.p.textbook}}&nbsp;</td>
    <td WIDTH="60">{{pc.p.venue}}&nbsp;</td>
    <td WIDTH="60">{{pc.p.attoch}}&nbsp;</td>
    <td><a href="/p_information/course/edit/{{pc.p.id}}/?pid={{p_obj.id}}" >Edit</a>&nbsp;&nbsp;&nbsp;&nbsp;<a href="/p_information/course/del/{{pc.p.id}}" onclick="return confirm('Are you sure to delete it?');">Del</a></td>
  </tr>
  {%endfor%}
  {%if pcpass_list%}
	  {%for pc in pcpass_list%}
	  <tr style="line-height:22px;">
		<td WIDTH="80">{{pc.p.period}}&nbsp;</td>
		<td WIDTH="80">{{pc.p.modules}}&nbsp;</td>
		{%if isnotsdf == '1'%}<td WIDTH="80">{{pc.p.core_elective}}&nbsp;</td>
		<td WIDTH="70">{{pc.p.coursecode}}&nbsp;</td>
		<td WIDTH="60">{{pc.p.season}}&nbsp;</td>
		{%endif%}
		<td WIDTH="50">{{pc.p.year}}&nbsp;</td>
		<td WIDTH="120">
			{%if pc.p.class_start%}Day 1:&nbsp;{{pc.p.class_start|date:'M d,Y'}}<br>{%endif%}
			{%if pc.p.class_end%}Day 2:&nbsp;{{pc.p.class_end|date:'M d,Y'}}<br>{%endif%}
			{%if pc.p.class_date3%}{%if datecount >= 4%}Day 3:&nbsp;{{pc.p.class_date3|date:'M d,Y'}}<br>{%endif%}
			{%if pc.p.class_date4%}Day 4:&nbsp;{{pc.p.class_date4|date:'M d,Y'}}{%endif%}<br>{%endif%}
			{%if pc.p.class_date5%}{%if datecount == 5%}Day 5:&nbsp;{{pc.p.class_date5|date:'M d,Y'}}{%endif%}{%endif%}
		</td>
		<td WIDTH="80">{{pc.p.lecture}}&nbsp;</td>
		<td >{{pc.p.textbook}}&nbsp;</td>
		<td WIDTH="60">{{pc.p.venue}}&nbsp;</td>
		<td WIDTH="60">{{pc.p.attoch}}&nbsp;</td>
		<td><a href="/p_information/course/edit/{{pc.p.id}}/?pid={{p_obj.id}}" >Edit</a>&nbsp;&nbsp;&nbsp;&nbsp;<a href="/p_information/course/del/{{pc.p.id}}" onclick="return confirm('Are you sure to delete it?');">Del</a></td>
	  </tr>
	  {%endfor%}
  {%endif%}
</table>
{% endblock %}
